<!DOCTYPE html>
<th:block xmlns:th="https://www.thymeleaf.org"
          th:insert="~{common/layout :: layout (showTitle = ${#messages.msg('page.tag.browser.title', tag.spec.displayName, site.title)},
       canonical = ${tag.status.permalink}, content = ~{::content}, isPost = false)}">
  <th:block th:fragment="content" th:with="isEmpty = ${#lists.isEmpty(posts?.items)}">
    <th:block th:if="${isEmpty}">
      <div class="card card-content main-title">
        <ul class="breadcrumb">
          <li><a th:href="@{/tags}" th:aria-label="#{page.tag.name}" th:title="#{page.tag.name}"><i class="ri-price-tag-3-line"></i>[[#{page.tag.name}]]</a></li>
          <li th:text="${tag.spec.displayName}"></li>
        </ul>
        <div class="card-empty" th:with="title=#{global.route.back.home.name},
            linkHtml='&lt;a href=&quot;/&quot; aria-label=&quot;' + ${title} + '&quot; title=&quot;' + ${title} + '&quot;&gt;' + ${title} + '&lt;/a&gt;',
            finalMessage=${#messages.msg('page.tag.posts.empty.tip', linkHtml)}">
          <i class="ri-inbox-2-fill"></i>
          [(${finalMessage})]
        </div>
      </div>
    </th:block>
    <th:block th:unless="${isEmpty}">
      <div class="card card-content main-title">
        <ul class="breadcrumb">
          <li><a th:href="@{/tags}" th:aria-label="#{page.tag.name}" th:title="#{page.tag.name}"><i class="ri-price-tag-3-line"></i>[[#{page.tag.name}]]</a></li>
          <li th:text="${tag.spec.displayName}"></li>
        </ul>
      </div>
      <th:block th:replace="~{main/article_list :: articleList (${posts.items})}"/>
      <th:block th:replace="~{main/pagination :: pagination (${posts}, ${tag.status.permalink})}"/>
    </th:block>
  </th:block>
</th:block>